/**
 * 档案借阅
 */
import React from "react";
import PropTypes from "prop-types";
import { routerRedux } from "dva/router";
import { connect } from "dva";
import { Row, Col, Button, Tabs, Tooltip, Icon } from "antd";
import Application from "./application";
import MyApplication from "./my";
import Checking from "./checking";
import Checked from "./checked";
import Details from "./details";
import GoList from "./goList"
import GoDetails from "./goDetails"
import SliderDetails from './sliderDetails'

const TabPane = Tabs.TabPane;
const HomePage = ({ location, dispatch, loading, borrow,newfile }) => {
  const permissions = sessionStorage.getItem("permissions")
  const { successTotal,list, pagination,menu, info, showDetails, goDetails, goList,sliderData,modalVisibleApp,currentItem,
    workflowList,modalVisibleChecking,showBorrowCheckModal } = borrow;
  const { userList } = newfile;
  const showMenu = id => {
    dispatch({
      type:"borrow/showMenu",
      payload:id
    })
  }

  const callback = key => {
    $("#sliderDetails").animate({ right: "-500" });
    dispatch({
      type: "borrow/stateAndType",
      payload: { operatingState: key, operatingType: 0 }
    });
    dispatch({
      type: "borrow/query",
      payload: { page: 1, pageSize: 10,operatingState: key, operatingType: 0 }
    });
    showMenu(key)
  };
  const detailsProps = {
    info,
    showList() {
      dispatch({
        type: "borrow/showList",
        payload: {}
      });
    }
  };
  const borrowHistoryList = (params) => {
    dispatch({
      type:"borrow/borrowHistory",
      payload:{
        ...params
      }
    })
  }
  const handleSearch = value => {
    dispatch({
      type: "borrow/borrowHistory",
      payload: { ...value }
    });
  };
  const goListProps = {
      loading: loading.effects['borrow/borrowHistory'],
      dataSource: list,
      pagination,
      userList,
      handleSearch,
      onChange(page) {
        dispatch({
          type: "borrow/borrowHistory",
          payload: { page: page.current, pageSize: page.pageSize }
        });
      },
      goDetails(id){
        dispatch({
          type:"borrow/goDetails1"
        })
        dispatch({
          type:"borrow/borrowHistoryDetails1",
          payload:{
            documentId:id
          }
        })
      },
      borrowHistoryList:borrowHistoryList,
      // borrowHistoryDetails(params){
      //   dispatch({
      //     type:"borrow/borrowHistoryDetails1",
      //     payload:{
      //       ...params
      //     }
      //   })
      // }

  }
  const goDetailsProps = {
      loading:loading.effects['borrow/borrowHistoryDetails1'],
      successTotal,
      list,
      pagination,
      onChange(page) {
        dispatch({
          type: "borrow/borrowHistoryDetails1",
          payload: { page: page.current, pageSize: page.pageSize }
        });
      },
  }
  const goList1 = () => {
    borrowHistoryList(),
    dispatch({
      type: "borrow/goList1"
    });
  }
  const returnBack = () => {
    dispatch({
      type: "borrow/returnBack"
    });
    dispatch({
      type:"borrow/query",
        payload: { page: 1, pageSize: 10, operatingState: menu }
    })
  }
  const returnList = () => {
    dispatch({
      type: "borrow/returnList"
    });
    borrowHistoryList()
  }
  const SliderDetailsProps = {
    workflowList,
    sliderData,
    menu,
    currentItem,
    onAgree(params){
      const borrowState = 1;
      dispatch({
        type: "borrow/updateApplication",
        payload: { ...params, borrowState }
      });
    },
    onDisAgree(params){
      const borrowState = 2;
      dispatch({
        type: "borrow/updateApplication",
        payload: { ...params, borrowState }
      });
    }
  }
  const ApplicationProps = {
    list,
    pagination, 
    modalVisibleApp, 
    currentItem, 
    userList,
    menu,
    dispatch,
    loading,
    getList(params){
      dispatch({
        type:"borrow/query",
        payload:{...params}
      })
    },
    
  }
  const CheckingProps = {
    menu,
    list,
    pagination,
    modalVisibleChecking,
    currentItem,
    showBorrowCheckModal,
    getList(params){
      dispatch({
        type:"borrow/query",
        payload:{...params}
      })
    },
  }
  return (
    <div className="content-inner" style={{ padding: 0 }}>
      {showDetails ? (
        <Details {...detailsProps} />
      ) : (
          goList == false ?
            <div style={{ position: "relative" }}>
              <Tabs defaultActiveKey={menu} onChange={callback}>
                {permissions.indexOf("borrowManager:borrow:apply") != -1 ?
                  <TabPane tab="借阅申请" key="0">
                    <Application {...ApplicationProps}/>
                  </TabPane> :
                  ""
                }
                {permissions.indexOf("borrowManager:borrow:apply") != -1 ?
                  <TabPane tab="我的借阅" key="1">
                    <MyApplication />
                  </TabPane> :
                  ""
                }
                {permissions.indexOf("borrowManager:borrow:checked") != -1 ?
                  <TabPane tab="待审核" key="2">
                    <Checking {...CheckingProps}/>
                  </TabPane> :
                  ""
                }
                {permissions.indexOf("borrowManager:borrow:checked") != -1 ?
                  <TabPane tab="已审核" key="3">
                    <Checked />
                  </TabPane> :
                  ""
                }
              </Tabs>
              <Tooltip placement="topLeft" title="可点此查看所有档案借阅历史">
                <Button
                  style={{ position: "absolute", top: 0, right: 0, border: "none" }}
                  onClick={goList1}
                >
                  <Icon type="right-circle-o" />
                  管理员审查
              </Button>
              </Tooltip>
            </div> :
            goDetails == false ?
              <div>
                <div style={{ marginBottom: 20, display: "flex", alignItems: "center" }}>
                  <Button
                    onClick={returnBack}
                  >
                    <Icon type="left-circle-o" />
                    返回
			        	  </Button>
                </div>
                <GoList {...goListProps}/>
              </div> :
              <div>
                <div style={{ marginBottom: 20, display: "flex", alignItems: "center" }}>
                  <Button
                    onClick={returnList}
                  >
                    <Icon type="left-circle-o" />
                    返回
			        	  </Button>
                </div>
                <GoDetails {...goDetailsProps}/>
              </div>


        )}
        
        <SliderDetails {...SliderDetailsProps} />
    </div>
  );
};

HomePage.propTypes = {
  location: PropTypes.object,
  borrow: PropTypes.object,
  dispatch: PropTypes.func,
  loading: PropTypes.object
};

export default connect(({ loading, borrow, newfile }) => ({ loading, borrow, newfile }))(
  HomePage
);
